<template >
    <div class="student">
        <h1 >学生姓名:{{name}}</h1>
        <h1 >学生性别:{{sex}}</h1>
        <h1 >当前求和为:{{number}}</h1>
        <button @click="add">number++</button>

        <button @click="sendStudentName">点击发送学生名字</button>
        <button @click="unBind" >解绑myEvent事件</button>
        <button @click="death">点我销毁student组件(vm)</button>

    </div>
</template>

<script>
export default {
    name:'Student',
    data() {
        return {
            name:'JJ',
            sex: '男',
            number:0
        }
    },
    methods:{
        add(){
            console.log("add被调用了")
            this.number++;
        },
        sendStudentName(){
            this.$emit('myEvent',this.name);
            // this.$emit('demo');
            //this.$emit("click")

        },
        unBind(){
            this.$off('myEvent'); //解绑一个
            // this.$off(['myEvent','demo']);//解绑多个事件
            // this.$off() //解绑所有事件
        },
        death(){
            this.$destroy()  //销毁了Student组件的实例,实例所绑定的自定义事件全都不奏效
        }
    }
   }
</script>

<style scoped lang="less">
.student{
    background-color: rgb(45, 37, 23);
    padding: 5px;
    margin-top: 30px;
}
</style>
